<template>
  <div class="footer">
    <ul>
      <router-link to="/home" tag="li">
        <span class="iconfont icon-shouye"></span>
        <p>首页</p>
      </router-link>
      <router-link to="/kind" tag="li">
        <span class="iconfont icon-fenlei"></span>
        <p>分类</p>
      </router-link>
      <router-link to="/cart" tag="li">
        <span class="iconfont icon-cart-Empty"></span>
        <p>购物车</p>
      </router-link>
      <!-- 我的及未登录 -->
      <router-link to="/my" tag="li" v-if="loginState">
        <span class="iconfont icon-wode"></span>
        <p>我的</p>
      </router-link>
      <router-link to="/login" tag="li" v-else>
        <span class="iconfont icon-wode"></span>
        <p>未登录</p>
      </router-link>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {

    }
  },
  computed: {
    // 判断是否登录 登录显示我的, 未登录显示未登录
    loginState(){
      if (localStorage.getItem("token")) {
        return true
      }else{
        return false
      }
    }
  }
}
</script>

<style>

</style>